<script setup lang="ts">
const props = defineProps<{ approvalStatus: any[] }>()

const visible = ref(false)

const formData = ref({
	applicant: '',
	approvalNo: '',
	interfaceName: '',
	businessSystemName: '',
	approverName: '',
	applyTime: '',
	applyReason: '',
	applyBusinessSystemName: '',
	approvalStatus: '',
	approvalTime: '',
	remark: ''
})

function init(rowData: any) {
	visible.value = true
	formData.value = { ...rowData }
}

defineExpose({
	init
})
</script>

<template>
	<ElDialog
		v-model="visible"
		title="审批详情"
		:close-on-click-modal="false"
		width="800px"
	>
		<el-form :model="formData">
			<el-row>
				<el-col :span="12">
					<el-form-item label="审批单号：">
						{{ formData.approvalNo }}
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="接口名称：">
						{{ formData.interfaceName }}
					</el-form-item>
				</el-col>

				<el-col :span="12">
					<el-form-item label="提供方业务系统：">
						{{ formData.businessSystemName }}
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="申请人：">
						{{ formData.approverName }}
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="申请人">
						{{ formData.applicant }}
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="申请时间：">
						{{ formData.applyTime }}
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="审批状态：">
						{{ props.approvalStatus.find(item => item.value === formData.approvalStatus)?.label }}
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="审批人：">
						{{ formData.approverName }}
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="审批时间：">
						{{ formData.approvalTime }}
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="申请理由：">
						{{ formData.applyReason }}
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="审批意见：">
						{{ formData.remark }}
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
	</ElDialog>
</template>

<style scoped></style>
